
var brandTitleIdArr=[];
var list=document.querySelector(".list")
let xhr1=new XMLHttpRequest();
xhr1.open("get",`http://chst.vip:1234/api/getbrandtitle`,false)
xhr1.onload=function(){
   var lis='';
  if(xhr1.status===200){
  let res1=JSON.parse(xhr1.responseText);

//                   console.log(res1.result);

                  res1.result.forEach(z => {
                    lis+=`
                    <div class="sm" >
                    <div class="title">
                    <h4>
                        <a href="javascript:"> 
                        <span>${z.brandTitle}</span>
                        <i>^</i>
                        </a>
                    </h4>
                    </div>

                    <div class="content">
                    
                    </div>

                    </div>
                    `
                    brandTitleIdArr.push(z.brandTitleId)
                  })
}
list.innerHTML=lis;
}
xhr1.send();

// console.log( brandTitleIdArr);

// 二级元素创建
var contentbox=document.querySelectorAll(".content");
// console.log(contentbox);


brandTitleIdArr.forEach((item,shu) => {
let xhr2=new XMLHttpRequest();
xhr2.open("get",`http://chst.vip:1234/api/getbrand?brandtitleid=`+item,false)
xhr2.onload=function(){
                    var lis2='';
                    if(xhr2.status===200){
                    let res2=JSON.parse(xhr2.responseText);
                    // console.log(res2.result);
                    res2.result.forEach(function(o,index){
                                        // console.log(index);
                    lis2+=`
                    <div class="pal" >
                    <div class="con">
                                        <div class="row">
                                        <div class="col" id="${o.brandId}">
                                                            <a href="javascript:" >
                                                            <i class="fl">${index}</i>
                                                            <span>${o.brandName}</span>
                                                            <p class="sel">${o.brandInfo}</p>
                                                            </a>         
                                        </div>
                                        </div>
                    </div>
                    `
                    })
                    contentbox[shu].innerHTML=lis2; 
}

}
xhr2.send();                    
});

// 抽屉效果

$(".content").slideUp(0);  
 

$(".list>.sm").click(function(){
$(this).find(".content").slideToggle().parent().siblings().find(".content").slideUp();
})  


// 点击获取元素col上的id
 $(".col").click(function(){
                    // console.log(+$(this).prop('id'));
window.location.href=`../html/branddetail.html?brandtitleid=${+$(this).prop('id')}`
}) 